/* carousel
*/
.el-carousel {
  --el-carousel-arrow-font-size: 16px;
  --el-carousel-arrow-size: 36px;
  --el-carousel-arrow-background: rgba(0, 0, 0, 0.2);
  --el-carousel-arrow-hover-background: rgba(0, 0, 0, 0.4);
  --el-carousel-indicator-width: 30px;
  --el-carousel-indicator-height: 2px;
  --el-carousel-indicator-padding-horizontal: 4px;
  --el-carousel-indicator-padding-vertical: 12px;
  --el-carousel-indicator-out-color: var(--white);
}
.el-carousel__indicators--outside {
  --el-carousel-indicator-out-color: var(--black);
}
.el-carousel__button {
  @apply rounded opacity-60;
  background-color: var(--el-carousel-indicator-out-color);
  &:hover {
    @apply opacity-80;
  }
}
.el-carousel__indicator.is-active {
  button {
    background-color: var(--primary-1);
  }
}
.el-carousel__mask {
  background-color: var(--primary-3);
}
